<template>
  <div id="app">
    <router-view></router-view>
  </div>
</template>

<script>
 // import '../static/font/iconfont2.js'
  export default {
    name: 'app'
  }
</script>

<style>
/*#app {
  font-family: 'Avenir', Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-align: center;
  color: #2c3e50;
  margin-top: 60px;
}*/
@import '../static/css/first.css';
.logo {
  font-size: 24px;
  float: left;
  margin: 0 30px;
  color: #fff;
  line-height: 60px;
}

#app .el-menu-header {
  background: #323c64;
  font-size: 20px;
}

#app .el-menu-item,
.el-submenu__title {
  color: #6672a3;
  border: none;
}

#app .el-menu-item.is-active {
  background: #3278fa;
  color: #fff;
  border: none;
}

#app .el-menu-item:hover {
  background: #3278fa;
  color: #fff;
  border: none;
}

.el-menu-demo .icon {
  width: 1.3em;
  height: 1.3em;
  vertical-align: -0.15em;
  fill: currentColor;
  overflow: hidden;
}

.el-menu-item {
  line-height: normal !important;
  height: 70px !important;
  width: 160px !important;
}

.menu_top {
  margin-top: 10px;
  margin-bottom: 8px;
}

.el-menu {
  height: 70px;
}

.logo_text {
  height: 70px;
  line-height: 70px;
}

.logo_segmentation {
  margin-left: 10px;
  margin-right: 10px;
}

#app .header_action {
  float: right;
}

.user_box {
  width: 160px;
  float: left;
  height: 70px;
  color: #6672a3;
  line-height: 70px;
}

.out_box {
  width: 100px;
  float: left;
  height: 70px;
  color: #6672a3;
  line-height: 70px;
}

.userout {
  /*background: url("~image/out.png");*/
  width: 28px;
  height: 28px;
  margin: 0 auto;
  display: block;
  margin: 0 auto;
  margin-top: 20px;
}

@media screen and (max-width:1300px) {
  .el-menu-item {
    line-height: normal !important;
    height: 70px !important;
    width: 20% !important;
  }
  .user_box {
    width: 20%;
    float: left;
    height: 70px;
    color: #6672a3;
    line-height: 70px;
  }
}
</style>
